<template>
  <div v-loading.fullscreen.lock="globalLoading"
    element-loading-text="正在切换实验室数据，请稍后..."
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)">
    <menutemplate :modelJson="modelData" :fromZujian="'shuisi'"></menutemplate>
    <!-- 组件（页面、功能） -->
    <div :class="{'contain':true,'bigCon':isBigCon,'smallCon':!isBigCon}">
      <el-breadcrumb separator-class="el-icon-arrow-right" style="height:35px;width:100%;line-height:35px;background:#fff;padding-left:10px;border-bottom:1px solid #f2f2f2" v-if="menuName!=''&& menuName!=null && pageName!='' && pageName!= null">
        <el-breadcrumb-item>{{menuName}}</el-breadcrumb-item>
        <!--<el-breadcrumb-item v-if="pageName!=''">{{pageName}}</el-breadcrumb-item>-->
        <el-breadcrumb-item v-if="pageName!=''">{{pageName}}</el-breadcrumb-item>
      </el-breadcrumb>
      <div v-bind:is="nowpage" :manujson="modelData" :userOpernation.sync="userOpernation" style="height:calc(100% - 35px);background:#fff;padding:10px;">
      </div>
    </div>
  </div>
</template>

<script>
  import { mapState } from 'vuex'
  import menutemplate from '@/common/menu.vue'
  
  //【首页】
  const homePage = () => import('./homePage.vue');//首页

  //【检测管理】
  //任务管理
  const abilitycollection = () => import('./detectionprocess/taskmanage/abilitycollection.vue');//检测管理-任务管理-项目集创建
  const detectionplan = () => import('./detectionprocess/taskmanage/detectionplan.vue'); //检测管理-任务管理-任务模板创建
  const newtaskmanage = () => import('./detectionprocess/taskmanage/newtaskmanage.vue');//检测管理-任务管理-任务下达
  //样品管理
  const sampleregistration = () => import('./detectionprocess/samplemanage/sampleregistration.vue');//检测管理-样品管理-采样登记
  const samplereception = () => import('./detectionprocess/samplemanage/samplereception.vue');//检测管理-样品管理-样品接收
  const yangpinlingqu = () => import('./detectionprocess/samplemanage/yangpinlingqu.vue');//检测管理-样品管理-样品领取
  //样品检测
  const mygrouptest = () => import('./detectionprocess/testmanage/mygrouptest.vue');//检测管理-样品检测-检测安排
  const jiancejieguo = () => import('./detectionprocess/testmanage/jiancejieguo.vue');//检测管理-样品检测-数据录入
  const mygroupcheck = () => import('./detectionprocess/testmanage/mygroupcheck.vue');//检测管理-样品检测-数据校核
  const mygroupsanjishenhe = () => import('./detectionprocess/testmanage/mygroupsanjishenhe.vue')//检测管理-样品检测-数据审核

  //【资源管理】
  //人员管理
  const usermanage = () => import('./resourcesManage/personnelManage/usermanage.vue');//资源管理-人员管理-人员信息
  const peixunguanli = () => import('./resourcesManage/personnelManage/peixunguanli.vue');//资源管理-人员管理-培训管理
  //仪器管理
  const basicinformationofinstrument = () => import('./resourcesManage/instrumentmanamge/basicinformationofinstrument.vue');//资源管理-仪器管理-仪器信息
  const yiqibaoyang = () => import('./resourcesManage/instrumentmanamge/yiqibaoyang.vue');//资源管理-仪器管理-仪器保养
  const yiqijianding = () => import('./resourcesManage/instrumentmanamge/yiqijianding.vue');//资源管理-仪器管理-仪器校准
  const qijianhecha = () => import('./resourcesManage/instrumentmanamge/qijianhecha.vue');//资源管理-仪器管理-期间核查
  const yiqiweixiu = () => import('./resourcesManage/instrumentmanamge/yiqiweixiu.vue');//资源管理-仪器管理-仪器维修
  const maintenance = () => import('./resourcesManage/instrumentmanamge/maintenance.vue');//资源管理-仪器管理-仪器维护-似乎无用
  //供应商管理
  const suppliermanagementt = () => import('./resourcesManage/suppliermanagement/suppliermanagementt.vue');//资源管理-供应商管理-供应商
  const subcontractor = () => import('./resourcesManage/suppliermanagement/suppliermanagement.vue');//资源管理-供应商管理-分包商
  //分包管理
  const subcontractrecord = () => import('./resourcesManage/subcontractor/subcontractrecord.vue');//资源管理-分包管理-分包记录-似乎无用
  //物资管理
  const ruKuShengPi = () => import('./resourcesManage/materialScience/ruKuShengPi.vue');//资源管理-物资管理-入库登记
  const chuKuShengPi = () => import('./resourcesManage/materialScience/chuKuShengPi.vue');//资源管理-物资管理-出库登记
  const kucun = () => import('./resourcesManage/materialScience/kucun.vue');//资源管理-物资管理-库存报表
  
  //【客户管理】
  const inspectionunit = () => import('./inspectionunit/inspectionunit/inspectionunit.vue');//客户管理-客户信息

  //【系统管理】
  //系统维护
  const attachmentmanage = () => import('./sysmanage/attachmentmanage/attachmentmanage.vue');//系统管理-系统维护-文档结构
  const originalEntry = () => import('./sysmanage/originalEntry.vue');//系统管理-系统维护-原始记录
  const sysMeasurementunit = () => import('./sysmanage/sysMeasurementunit.vue');//系统管理-系统维护-计量单位
  const warehouseManagement = () => import('./sysmanage/warehouseManagement.vue');//系统管理-系统维护-仓库管理
  const bottleManage = () => import('./standardManage/systemMaintenance/bottleManage.vue');//系统管理-系统维护-容器管理
  const stationManage = () => import('./sysmanage/stationmanage/station.vue');//系统管理-系统维护-厂站管理
  //技术标准
  const analysisitem = () => import('./standardManage/analysisitem/analysisitem.vue');//系统管理-技术标准-检测项目
  const methodmanagement = () => import('./standardManage/methodStandar/methodmanagement.vue');//系统管理-技术标准-检测方法
  const ability = () => import('./standardManage/ability/ability.vue');//系统管理-技术标准-能力参数
  const equipStandar = () => import('./standardManage/equipStandar/equipStandar.vue');//系统管理-技术标准-仪器标准
  const standardmanagement = () => import('./standardManage/evaluateStandar/standardmanagement.vue');//系统管理-技术标准-评价标准
  const materialScienceStock = () => import('./resourcesManage/materialScience/materialScienceStock.vue');//系统管理-技术标准-物资资料

  //【标准管理】
  //系统维护
  const measurementunit = () => import('./sysmanage/basicconfiguration/measurementunit.vue');//标准管理-系统维护-计量单位
  const datadictionary = () => import('./sysmanage/basicconfiguration/datadictionary.vue');//标准管理-系统维护-数据字典
  //组织管理
  const depManagement = () => import('./sysmanage/biaozhunguanli/orgManagement/department.vue'); //标准管理-组织管理-部门管理
  const staffManagement = () => import('./sysmanage/biaozhunguanli/orgManagement/staff.vue'); //标准管理-组织管理-职员管理
  const labManagement = () => import('./sysmanage/biaozhunguanli/orgManagement/experiment.vue'); //标准管理-组织管理-实验室管理
  //权限管理
  const menuManagement = () => import('./sysmanage/biaozhunguanli/authorityManagement/menu.vue'); //标准管理-权限管理-菜单管理
  const roleManagement = () => import('./sysmanage/biaozhunguanli/authorityManagement/role.vue'); //标准管理-权限管理-角色管理
  const authorityControl = () => import('./sysmanage/biaozhunguanli/authorityManagement/control.vue'); //标准管理-权限管理-权限控制

  export default {
    name: 'App',
    data() {
      return {
        userOpernation:{},
        modelData: [{
					"name": "",
					"page": "",
					"pageAddress": "",
					"sub": [],
				}],
        lastpage: '',
        pagebarwidth: '',
        pagebarleft: '',
        //    rightmenuStruchFlag:true,

        daiban: [
          {
            name: '检测管理',
            tips: 7,
            src: require("../assets/img/caiyang.png"),
            //                topmenu:'1',
            //                page:'sampleregistration',
          },
          {
            name: '报告管理',
            tips: 3,
            src: require("../assets/img/get.png"),
          },

          {
            name: '仪器管理',
            tips: 1,
            src: require("../assets/img/jieshou.png"),
          }, {
            name: '物资管理',
            tips: 1,
            src: require("../assets/img/jiance.png"),
          },
          //

        ],
        isBigCon:true, //是否满屏显示
      }
    },
    computed: {
      ...mapState(['globalLoading','nowpage', 'topmenu', 'leftmenuStruchFlag', 'pagename', 'pageName', 'menuName', 'rightmenuStruchFlag']),
    },
    watch: {
      // 模块按钮权限  监听页面变化就去取数据
      '$store.state.nowpage': function (val,oldVal) {
        this.userOpernation = JSON.parse(sessionStorage.getItem('userOpernation'))
        sessionStorage.setItem('pageObj',JSON.stringify({nowPage:val, oldPage:oldVal}))

        if(this.modelData[this.topmenu].page == 'homePage'){
            this.isBigCon = true
        }else{
          this.isBigCon = false
        }

      }
    },

    mounted() {
      this.getUserModel(this.globalLoading)
      this.$store.commit('changenowpage', 'homePage');
      this.$store.commit('changetopmenu', 0)
    },

    components: {
      'menutemplate': menutemplate,//导航栏信息
      'homePage': homePage,//首页
      'abilitycollection': abilitycollection,//检测管理-任务管理-项目集创建
      'detectionplan': detectionplan,//检测管理-任务管理-任务模板创建
      'newtaskmanage': newtaskmanage,//检测管理-任务管理-任务下达
      'sampleregistration': sampleregistration,//检测管理-样品管理-采样登记
      'samplereception': samplereception,//检测管理-样品管理-样品接收
      'yangpinlingqu': yangpinlingqu,//检测管理-样品管理-样品领取
      'mygrouptest': mygrouptest,//检测管理-样品检测-检测安排
      'jiancejieguo': jiancejieguo,//检测管理-样品检测-数据录入
      'mygroupcheck': mygroupcheck,//检测管理-样品检测-数据校核
      'mygroupsanjishenhe': mygroupsanjishenhe,//检测管理-样品检测-数据审核
      'usermanage': usermanage,//资源管理-人员管理-人员信息
      'peixunguanli': peixunguanli,//资源管理-人员管理-培训管理
      'basicinformationofinstrument': basicinformationofinstrument,//资源管理-仪器管理-仪器信息
      'yiqibaoyang': yiqibaoyang,//资源管理-仪器管理-仪器保养
      'yiqijianding': yiqijianding,//资源管理-仪器管理-仪器校准
      'qijianhecha': qijianhecha,//资源管理-仪器管理-期间核查
      'yiqiweixiu': yiqiweixiu,//资源管理-仪器管理-仪器维修
      'maintenance': maintenance,//资源管理-仪器管理-仪器维护
      'suppliermanagementt':suppliermanagementt,//资源管理-供应商管理-供应商
      'subcontractor': subcontractor,//资源管理-供应商管理-分包商
      'subcontractrecord': subcontractrecord,//资源管理-分包管理-分包记录
      'ruKuShengPi': ruKuShengPi,//资源管理-物资管理-入库登记
      'chuKuShengPi': chuKuShengPi,//资源管理-物资管理-出库登记
      'kucun': kucun,//资源管理-物资管理-库存报表
      'inspectionunit': inspectionunit,//客户管理-客户信息
      'attachmentmanage': attachmentmanage,//系统管理-系统维护-文档结构
      "originalEntry":originalEntry,//系统管理-系统维护-原始记录
      "sysMeasurementunit": sysMeasurementunit,//系统管理-系统维护-计量单位
      "warehouseManagement": warehouseManagement,//系统管理-系统维护-仓库管理
      "bottleManage":bottleManage,//系统管理-系统维护-容器管理
      "stationManage":stationManage,//系统管理-系统维护-厂站管理
      'analysisitem': analysisitem,//系统管理-技术标准-检测项目
      'methodmanagement': methodmanagement,//系统管理-技术标准-检测方法
      'ability': ability,//系统管理-技术标准-能力参数
      'equipStandar': equipStandar,//系统管理-技术标准-仪器标准
      'standardmanagement': standardmanagement,//系统管理-技术标准-评价标准
      'materialScienceStock': materialScienceStock,//系统管理-技术标准-物资资料
      'measurementunit': measurementunit,//标准管理-系统维护-计量单位
      'datadictionary': datadictionary,//标准管理-系统维护-数据字典
      'depManagement': depManagement,//标准管理-组织管理-部门管理
      'staffManagement': staffManagement,//标准管理-组织管理-职员管理
      'labManagement': labManagement,//标准管理-组织管理-实验室管理
      'menuManagement': menuManagement,//标准管理-权限管理-菜单管理
      'roleManagement': roleManagement,//标准管理-权限管理-角色管理
      'authorityControl': authorityControl,//标准管理-权限管理-权限控制
    },
    methods: {
      getUserModel() {
        this.$http({
          apiUrl: '/getUserModels.htm',
          method: 'post',
        }).then(res => {
          if (res.code == 0) {
            for (var i in res.data) {
              if (res.data[i].pageAddress !== undefined) {
                res.data[i].page = res.data[i].pageAddress
              }
            }
            sessionStorage.setItem('premodelDataJson',JSON.stringify(res.data))
            let setting = {
              id: "id",
              pid: "parent",
              root: "",
              data: res.data
            };
            this.modelData = this.$listtotree(setting)[0].sub;
            // this.$store.commit('changenowpage', this.modelData[0].page);
            this.changetopmenu(this.modelData[0],0)

            if(this.modelData.length != 0 && this.modelData[0].page == 'homePage'){
              var arr = [];
              this.$set(this.modelData[0],'sub', arr)
            }
           sessionStorage.setItem('modelDataJson',JSON.stringify(this.modelData))
          }

        })
      },
      selUserOpernationByModelId(item) {
      	return new Promise((resolve, reject) => {
      		this.$http({
      			apiUrl: '/selUserOpernationByModelId.htm',
      			method: 'post',
      			params: {
      				moduleId: item.id
      			},
      			isJson: false
      		}).then(res => {
      			// console.log(res)
      			if (res.code === 0) {
      				resolve(res)
      			}

      		})
      	})
      },
      changetopmenu: function (item, name) {
      	console.log(item,name)
      	this.selectPage = item.pageAddress
      	this.$store.commit('changetopmenu', name)
      	this.$store.state.menuName = item.name;
      	//根据当前点击得头部按钮得page，默认显示第一个页面
      	var currentPage = null;
      	var currentPageName = null;
      	// 实验室数据
      	if (item.page == 'homePage') { //如果点击得是首页，显示得对应page地址是homePage
      		currentPage = 'homePage';
      		this.$store.state.menuName = null;
      		currentPageName = null;
      		this.$store.commit('changenowpage', currentPage);
      	} else {   //如果点击的头部sub没有子集,就默认显示sub[0],如果sub还有一个sub子集 显示得第一个sub的第一个子集    sub[0].sub[0]

      		if (item.sub[0].sub == undefined || item.sub[0].sub.length == 0) {
      			// console.log(item.sub[0])
      			currentPage = item.sub[0].page;
      			currentPageName = item.sub[0].name;
      			// 点击切换页面 重新储存页面按钮数据
      			this.$store.state.moduleId = item.sub[0].id;
      			this.selUserOpernationByModelId(item.sub[0]).then(res => {
      				sessionStorage.setItem("userOpernation", JSON.stringify(res.data))
      				this.$store.commit('changenowpage', currentPage);
      			}).catch(err => {
      				this.$store.commit('changenowpage', currentPage);
      			})

      		} else {
      			currentPage = item.sub[0].sub[0].page;
      			currentPageName = item.sub[0].sub[0].name;
      			this.$store.state.moduleId = item.sub[0].sub[0].id;
      			this.selUserOpernationByModelId(item.sub[0].sub[0]).then(res => {
      				sessionStorage.setItem("userOpernation", JSON.stringify(res.data))
      				this.$store.commit('changenowpage', currentPage);
      			}).catch(err => {
      				this.$store.commit('changenowpage', currentPage);
      			})
      		}
      	}
      	// if(item.page == "testManage"){
      	// 	this.delUnnecessaryData();
      	// }
      	if (item.page == "zhongxinReport" || item.page == "zhongxinTest") {
      		if (item.sub[0].sub == undefined || item.sub[0].sub.length == 0) {
      			currentPage = item.sub[0].page;
      			currentPageName = item.sub[0].name;
      		} else {
      			currentPage = item.sub[0].sub[0].page;
      			currentPageName = item.sub[0].sub[0].name;
      		}
      	}
      	// this.$store.commit('changenowpage', currentPage);
      	this.$store.state.pageName = currentPageName;
      	this.$store.commit('changetopmenu', name)
      },
	  banBackSpace(event){
	      if (event.code == 8) {// backspace的keycode=8

	      var type = document.activeElement.type;// 获取焦点类型

	      if (type == "text" || type == "textarea" || type == "password"

	      || type == "select") {// 判断焦点类型，无法输入的类型一律屏蔽

	      if (document.activeElement.readOnly == false)// 如果不是只读，则执行本次backspace按键

	      return true;

	      }

	      event.code = 0;// 将本次按键设为0（即无按键）

	      event.returnValue = false;

	      return false;

	      }
	  }

    }
  }

</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
